<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri = "http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>登录界面</title>
<link rel="stylesheet" href="<%=request.getContextPath() %>/vendor/bootstrap/css/bootstrap.min.css"/>
<style>
form {
	margin-top: 50px;
	
}
.btn{
	width:200px;
	position:relative;
	left:1px;
	float:left;
	
}
#btn{
	width:100px;
	position:relative;
	margin-top:-50px;
	left:220px;
	float:left;
	
}
#validate{
	float:left;
	
}
 #code{
	width:90px;
	height:30px;
	margin-left:10px;
} 
</style>
</head>
<body>
<div class="container">
		
		<c:if test="${!empty errorInfo || !empty sessionClosed}">
		<div class="alert alert-warning alert-dismissible fade in" role="alert">
			<button type="button" class="close" data-dismiss="alert">
				<span aria-hidden="true">×</span><span class="sr-only">Close</span>
			</button>
			<strong>${errorInfo} ${sessionClosed} </strong> 用户名或密码错误！
		</div>
		</c:if>
		
		
		
		<c:if test="${! empty resultValidate}">
		<div class="alert alert-warning alert-dismissible fade in" role="alert">
			<button type="button" class="close" data-dismiss="alert">
				<span aria-hidden="true">×</span><span class="sr-only">Close</span>
			</button>
			<strong>登录失败!</strong>验证码输入错误
		</div>
		</c:if>
		
		
		
		<form class="form-horizontal" role="form" action="<%=request.getContextPath()%>/TalentServlet?command=login" onsubmit="return validate();" method="POST" >
		<fieldset > 
		<legend >求&nbsp;&nbsp;职&nbsp;&nbsp;&nbsp;&nbsp;者&nbsp;&nbsp;登&nbsp;&nbsp;录</legend>
			<div class="form-group">
				<label for="code1" class="col-sm-2 control-label">账号　:</label>
				<div class="col-sm-10">
					<input type="text" class="form-control" id="code1"
						name="code" style = "width:300px" value = "${code='guo' }"><span id="codeTip"></span>
				</div>
			</div>
			<div class="form-group">
				<label for="password" class="col-sm-2 control-label">密码　:</label>
				<div class="col-sm-10">
					<input type="password" class="form-control" id="password"
						name="passwd" style = "width:300px" value = "123456"><span id="passwordTip"></span>
				</div>
			</div>
			
			<div class="form-group">
				<label for="validate" class="col-sm-2 control-label">验证码　:</label>
				<div class="col-sm-10">
					<input type="text" class="form-control" id="validate"
						name="validate" style = "width:200px">
						<img src="<%=request.getContextPath() %>/validate_code.jsp" id="code" onclick="change();">
				</div>
			</div>
			
			  <div class="form-group">
		   <div class="col-sm-offset-2 col-sm-10">
		      <input type="checkbox"> 记住密码
		      </div>
		    
		  </div>
			
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="submit" class="btn btn-primary" >登 录</button>
				</div>
			</div>
			
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="submit" class="btn" id = "btn"><a href = "<%=request.getContextPath()%>/static/talent/talent-register.jsp">注 册</a></button>
				</div>
			</div>
			
			
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="button" class="btn " onclick = "location = '<%=request.getContextPath()%>/PositionServlet?command=list'">招聘主页</button>
				</div>
			</div>
			</fieldset>
		</form>
	</div>
	
		<script >
			function validate(){
				var result = true;
				
				//验证账号
				var code = document.getElementById("code1").value;
				var password = document.getElementById("password").value;
				if(code == ''){
/* 					document.getElementById('codeTip').innerHTML = '<img src="img/err.png"/><font color="red">帐号不能为空！</font>' */						

					result  = false;
					layer.msg('用户名不能为空!',{time:500,icon:5});
				}else if((code.length < 3) || (code.length > 12)){
					document.getElementById('codeTip').innerHTML = '<img src="img/err.png"/><font color="red">帐号的长度必须在3~12之间！</font>'
						result  = false;
					
				}else {
					document.getElementById('codeTip').innerHTML = '<img src="img/ok.png"/>';
				}
				//验证密码
				if (password == '') {
					document.getElementById('passwordTip').innerHTML = '<img src="img/err.png"/><font color="red">密码不能为空！</font>'
					result = false;
				} else if ((password.length < 6) || (password.length > 12)) {
					document.getElementById('passwordTip').innerHTML = '<img src="img/err.png"/><font color="red">密码的长度必须在6~12之间！</font>'
					result = false;
				} else {
					document.getElementById('passwordTip').innerHTML = '<img src="img/ok.png"/>';
				}
				return result;
			}
			
		</script>
		<script>
		function change() {
			document.getElementById('code').src='<%=request.getContextPath() %>/validate_code.jsp?time='+ new Date().getTime();
		}
	</script>
	<script src="vendor/jquery.min.js"></script>
	<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
	<script src = "vendor/layer/layer.js"></script>
</body>
</html>